<template>
    <div class="header">
            <span @click="toggle">
                <el-icon-expand v-if="collapse" style="margin-right:10px"></el-icon-expand>
                <el-icon-fold v-else></el-icon-fold>
          </span>

    </div>
      
</template>

<script lang="ts" setup>
import {ref} from 'vue'
let props = defineProps<{
    collapse:boolean
}>()
let emits = defineEmits(['update:collapse'])
let isCollapse = ref(true)
let toggle= () =>{
    // 需要修改父组件的值
    emits('update:collapse', !props.collapse)
  
}
</script>

<style lang="scss" scoped>
 
    .header{
        height:60px;
        padding:0 20px;
        display:flex;
        align-items:center;
    }
</style>